<template>
	<div class="header">
	      <div class="logo">
	        <img src="../../assets/logo.png">
	      </div>
	      <div class="logen">
	        <h3>狗眼电影</h3>
	        <p>查影讯，上狗眼电影就够了！</p>
	      </div>
	      <input type="text" placeholder="请输入电影名" class="search" v-on:click="search">
	   </div>
</template>
<script>
	export default{
		name:'vheader',
		data(){
			return{

			}
		},
    methods:{
        search:function(){
          this.$router.push({path:"/search"})
      }
    }
	}
</script>
<style>
	.header{
    overflow: hidden;
    padding: 10px 20px;
    background: #e5e9f2;
  }
  .header .logo img{
      width: 42px;
      height: 42px;
      padding-right: 7px;
      float: left;
  }
  .header .logen{
    float: left;
  }
  .header .logen h3{
    font-size: 17px;
    font-weight: 700;
    line-height: 20px;
    color: #333;
  }
  .header .logen p{
    font-size: 12px;
    padding-top: 5px;
    color: #999;
  }
  .header .search{
    float: right;
    width: 30%;
    height: 40px;
    border-style: none;
    border-radius: 15px;
    padding-left: 10px;
    outline: none;
  }
   .start-movie{
    background: #df2d2d;
    text-align: center;
    overflow: hidden;
  }
  .start-movie .v-nav{
    text-align: center;
    text-decoration: none;
    height: 35px;
    line-height: 35px;
    font-size: 20px;
    color: #f9fafc;
    padding: 0px 47px;
  }
</style>